import 'package:flutter/material.dart';
import 'package:flutter_app/components/layout.dart';
import 'package:flutter_app/utils/AppUtil.dart';

class ZeroInterestPage extends StatefulWidget {
  @override
  _ZeroInterestPageState createState() => _ZeroInterestPageState();
}

Widget GreyText(String text) {
  return Text(
    text,
    style: TextStyle(color: Colors.grey, fontSize: 12),
  );
}

Widget RecommendItem(context,
    {String serveRate,
    String pledgeRate,
    String profitStop,
    Widget titleLeft}) {
  return InkWell(
    onTap: () {
      Navigator.pushNamed(context, '/loan/zero/detail');
    },
    child: Container(
      padding: EdgeInsets.symmetric(vertical: 20.0),
      decoration: BoxDecoration(
          border:
              Border(bottom: BorderSide(color: Colors.grey.withOpacity(0.1)))),
      child: Column(
        children: [
          RowBetween(children: [
            titleLeft,
            Icon(
              Icons.arrow_forward_ios_outlined,
              size: 14,
              color: Colors.grey,
            )
          ]),
          SizedBox(
            height: 10.0,
          ),
          RowBetween(crossAxisAlignment: CrossAxisAlignment.end, children: [
            ColumnStart(
              children: [
                Text(
                  '\$' + profitStop,
                  style: TextStyle(
                      color: Colors.blueAccent,
                      fontSize: 22,
                      fontFamily: 'dinpro'),
                ),
                GreyText('止盈价'),
              ],
            ),
            Column(
              children: [
                Text(
                  pledgeRate + '%',
                  style: TextStyle(
                      color: Colors.black,
                      fontWeight: FontWeight.w700,
                      fontFamily: 'PingFang'),
                ),
                GreyText('质押率'),
              ],
            ),
            Column(
              children: [
                Text(
                  serveRate + '%',
                  style: TextStyle(
                      color: Colors.black,
                      fontWeight: FontWeight.w700,
                      fontFamily: 'PingFang'),
                ),
                GreyText('服务费率'),
              ],
            )
          ])
        ],
      ),
    ),
  );
}

class _ZeroInterestPageState extends State<ZeroInterestPage> {
  @override
  Widget build(BuildContext context) {
    return Container(
        padding: EdgeInsets.symmetric(horizontal: 15.0, vertical: 15.0),
        child: Column(
          children: [
            ShadowContainer(
                child: ColumnStart(
              children: [
                Container(
                  width: double.infinity,
                  padding: EdgeInsets.only(bottom: 10.0),
                  decoration: BoxDecoration(
                      border: Border(
                          bottom:
                              BorderSide(color: Colors.grey.withOpacity(0.3)))),
                  child: ColumnStart(
                    children: [
                      Text(
                        '零息借贷',
                        style: TextStyle(
                            fontSize: 18, fontWeight: FontWeight.w500),
                      ),
                      Text(
                        '永不爆仓、崩盘保护',
                        style: TextStyle(
                            fontWeight: FontWeight.w500,
                            fontSize: 12,
                            color: Colors.black54),
                      ),
                    ],
                  ),
                ),
                InkWell(
                  onTap: () {},
                  child: Container(
                    padding: EdgeInsets.symmetric(vertical: 15.0),
                    child: RowBetween(
                      children: [
                        Text(
                          '产品介绍',
                          style:
                              TextStyle(fontSize: 16, color: Colors.blueAccent),
                        ),
                        Icon(
                          Icons.arrow_forward_ios_outlined,
                          size: 15,
                          color: Colors.grey,
                        )
                      ],
                    ),
                  ),
                )
              ],
            )),
            Container(
              margin: EdgeInsets.only(top: 18),
              padding: EdgeInsets.symmetric(vertical: 15.0),
              decoration: BoxDecoration(
                  border: Border(
                      bottom: BorderSide(color: Colors.grey.withOpacity(0.2)))),
              child: RowBetween(children: [
                Text(
                  'BTC指数',
                  style: TextStyle(fontSize: 16, fontWeight: FontWeight.w500),
                ),
                Text(
                  '\$ ' + AppUtil.formatNum(54724.43, point: 2),
                  style: TextStyle(
                      color: Colors.blueAccent,
                      fontSize: 18,
                      fontWeight: FontWeight.w500,
                      fontFamily: 'dinpro'),
                ),
              ]),
            ),
            Container(
                padding: EdgeInsets.only(top: 20.0),
                alignment: Alignment.centerLeft,
                child: Text(
                  '推荐方案',
                  style: TextStyle(fontWeight: FontWeight.w500, fontSize: 16),
                )),
            RecommendItem(context,
                titleLeft: RichText(
                  text: TextSpan(children: [
                    TextSpan(
                        text: '2021-06-25 到期',
                        style: TextStyle(
                            color: Colors.black, fontWeight: FontWeight.w500)),
                    TextSpan(
                        text: ' 101天',
                        style: TextStyle(
                            color: Colors.grey, fontWeight: FontWeight.w500))
                  ]),
                ),
                profitStop: AppUtil.formatNum(88000),
                pledgeRate: '55',
                serveRate: '0.5'),
          ],
        ));
  }
}
